<script lang="ts" setup>

import {onMounted, reactive, ref} from 'vue';
import {pageJobAPI} from "@/apis/job.ts";
import {message} from "ant-design-vue";
import {useRouter} from "vue-router";
import {useInfoStore} from "@/store/user/user.ts";
//中间岗列表
const data = <any>reactive([]);
const getJobList = async () => {
  const res = await pageJobAPI({
    pageCurrent: pagination.value.current,
    pageSize: pagination.value.pageSize,
    jobEmployerId: useInfoStore().userInfo.userId
  });
  if (res.data.flag) {
    pagination.value.total = res.data.data.total
    data.push(...res.data.data.data)
  } else {
    message.error(res.data.message)
  }
}
//生命周期
onMounted(() => {
  getJobList();
})

const columns = [
  {
    title: '兼职名称',
    dataIndex: 'jobTitle',
    key: 'jobTitle',
  },
  {
    title: '兼职状态',
    dataIndex: 'jobStatus',
    key: 'jobStatus',
  },
  {
    title: '兼职类型',
    dataIndex: 'jobType',
    key: 'jobType',
  },
  {
    title: '薪资待遇',
    dataIndex: 'jobSalary',
    key: 'jobSalary',
  },
  {
    title: '兼职地点',
    dataIndex: 'jobLocation',
    key: 'jobLocation',
  },
  {
    title: '操作',
    dataIndex: 'operation',
    key: 'operation',
  },
];

// 分页配置
const pagination = ref({
  current: 1, // 当前页码，初始为第 1 页
  pageSize: 8, // 每页显示的记录数
  total: 0, // 数据总条数
});

// 处理表格变化（如分页、排序、筛选）的回调函数
const handleTableChange = (paginationInfo:any) => {
  console.log(paginationInfo)
  pagination.value.current = paginationInfo.current;
  pagination.value.pageSize = paginationInfo.pageSize;
  data.splice(0, data.length);
  getJobList();
};
//编辑
const router = useRouter();
const goToJobDetail = (jobId: string) => {
  router.push({
    name: 'jobDetail',
    params: {
      jobId: jobId // 确保传递的参数为字符串类型
    }
  });
};
</script>

<template>
  <div class="title">
    <h1>岗位列表</h1>
  </div>
  <div class="content_table">
    <a-table :columns="columns" :data-source="data" :pagination="pagination" @change="handleTableChange">
      <template #bodyCell="{ column, text, record }">
        <template v-if="column.dataIndex === 'operation'">
          <a-button  type="primary" ghost  @click="goToJobDetail(record.jobId)">编辑</a-button>
        </template>
      </template>
    </a-table>
  </div>

</template>

<style scoped>

</style>
